<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.11.0.min.js"></script>
 <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<title>Insert title here</title>
<jsp:include page="/top.jsp"></jsp:include>

<!-- ***********CSS样式 *************** -->
<style type="text/css">

body div{border:0px solid red;
}
.main{margin-bottom: 100px;
}
.main div{border:0px;background-color: #defae5;
}
.inner{width:100%;height:90%;
}
.imagediv{width:210px;height:200px;float: left;margin-left:17px;margin-top: 5px;
border:1px solid white !important;
}
.imagediv:hover{border:1px solid #f6ad90 !important;
}
.imagediv img{width:95%; height:80%;margin-left: 5px;margin-top: 5px;
}
.btnmain{width:100%; height:50px;border:1px solid black;float: left;
background-color: white !important;
}
.btnmian div{
}
.word,.word div{background-color: white;
}
</style>

<!-- 页面索引 -->
<script type="text/javascript">
	$(function(){
		$(".btnmain div").css('background-color','rgba(0,0,0,0)');
		
		var n=${page.currentpage};
		var k=${page.currentpage};
		var h=${page.sumpage};
		if(n==1){
			//$("#lastpage").css("display","none");
			$("#lastpage1").attr("disabled",true);
		}
		if(k==h){
			$("#nextpage1").attr("disabled",true);
			//$("#nextpage").css("display","none");
		}
		$("input").css('background',"#defae5");
		$("#page${page.currentpage}").css("background-color","green");
	});
</script>

<!-- 改变颜色 -->
<script type="text/javascript">
$(function(){
	$('.selected4').css("background","url(images/changeColor.png)");
	$('.selected4').css("color","green");
	
})
</script>

<!--  	$(this).attr('name')	 -->
<!-- 判断是否为登录状态 -->
<script type="text/javascript">
	$(function(){
		$(".btn_shou").click(function(){

			if("${user}"==""){
				alert("请先登录");
			}else{
// 				alert($(this).attr('name'));
				var url = "${pageContext.request.contextPath}/ShouServlet";
				var param ="plantID="+$(this).attr('name');
				$.get(url, param, function(d){
					if(d.msg=="1"){
						alert("收藏成功");
					}else{
						alert("已经收藏过");
					}
					
				}, "json");
			}
		});
	});
</script>


</head>
<body>

<div class ="main" style = "width:69%;margin-left:15%;margin-right:15%;border:0px solid blue;float: left;">
	
	<div class = "word" style = "border:0px;background-color: white;float: left;">
		<div class = "wordcontent" style = "float: left;border:0px;border-radius:0px;margin-bottom:10px;border-bottom:3px solid green;float:left;font-size:24px;height:40px;margin-left:20px;line-height: 40px;width:880px;padding:10px;color:green;float:left;">
			<div style = "background-color: white;border:0px;">
				<b style = "font-size: 40px;line-height: 40px;float: left;color:pink">❀</b>
			</div>
			<div style = "float: left;background-color: white; border:0px;font-weight: bold;">
				&nbsp植物图鉴
			</div>
		</div>
	</div>
	<div class="inner">
			<c:forEach items = "${AllPic }" var = "n" varStatus="v" >
				<div class = "imagediv">
					 <img alt="" src="${n.path }">
					 <div class = "btn_shous" ><input type = "button" class="btn_shou" name = "${n.plantID }" value="收藏"> </div>
				</div>
			</c:forEach>
			
	</div>
<!-- ***************页码************ -->
	<div class = "btnmain" >
		<div class = "btninner" style = "margin-left: 20%; margin-right: 20%;height:100%;">
			<div style="margin-top:10px;">
		共${page.sumpage }页
		<a href="${pageContext.request.contextPath }/ShowPicServlet?page=1">  <input type="button" value="首页" id="first" >  </a>
		<a id="lastpage" href="${pageContext.request.contextPath }/ShowPicServlet?page=${page.currentpage-1}">  <input type="button" value="上一页" id="lastpage1">   </a>
		<c:set value="${page.sumpage }" var="sumpage" />
		
		<c:forEach begin="1" end="${page.sumpage }" var="n" step="1">
			<c:choose>
				<c:when test="${page.buttonbegin-1<n&&page.buttonend+1>n}">
					<a href="${pageContext.request.contextPath }/ShowPicServlet?page=${n}"><input type="button" value="${n }" id="page${n }"></a>
				</c:when>
			</c:choose>
		</c:forEach>
		<a id="nextpage" href="${pageContext.request.contextPath }/ShowPicServlet?page=${page.currentpage+1}">  <input type="button" value="下一页" id="nextpage1">   </a>
		<a href="${pageContext.request.contextPath }/ShowPicServlet?page=${page.sumpage}">  <input type="button" value="尾页" id="lastestpage">   </a>
	</div>
		</div>
	</div>
</div>




</body>
</html>